<template>
 <div class='chatlist'>
     <Header />
     <div class="content">
           <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
                <el-tab-pane label="我的好友" name="first">
                    <Chat />
                </el-tab-pane>
                <el-tab-pane label="群聊中心" name="second">
                    <Chats />
                </el-tab-pane>    
            </el-tabs>
     </div>
 </div>
</template>

<script>
import Header from '@/components/common/header.vue'
import Chat from "@/components/chat/chat.vue"
import Chats from "@/components/chat/chats.vue"
   export default {
      data() {
          return {
              activeName: 'first',          
          }
      },
      //生命周期 - 创建完成
     created(){ 
        
       
     },

     //DOM挂载完毕
     mounted() {

     },
     components: {
       Header,
       Chat,
       Chats
     },
      methods: {
          //选项卡点击事件
           handleClick(tab, event) {
      }


      },
 }
</script>

<style lang='less' scoped>
.chatlist{
    background-color: #fff;
    min-height: 100vh;
}
</style>